import { useParams } from "react-router-dom";
import axios from "axios";
import { useEffect, useState } from "react";
import "./Patient.css"
interface Props {
    _id: string,
    Medical: string
    Card: string,
    Name: string,
    Sex: string,
    Type: string,
    Documents: string,
    status: string,
    Time: string,
}

const Disease: React.FC<Props> = () => {
    const { id } = useParams<{ id: string }>()
    const [list, setlist] = useState<Props[]>([])
    const getlist = () => {
        axios.get(`http://127.0.0.1:3000/cws/index/?_id=${id}`).then((response) => {
            const { code, data } = response.data
            if (code == 200) {
                setlist(data)
            }
        })
    }

    useEffect(() => {
        getlist()
    }, [])
    return (
        <div>
            <div className="content">
                {
                    list.map((item, index) => {
                        return <ul key={index} style={{listStyle:"none"}} className="content_in">
                            姓名：<li style={{ marginLeft: "75px", marginTop: "-20px" }}>{item.Name}</li>
                            <span style={{ marginLeft: "150px", marginTop: "-22px", float: "left" }}>性别：<li style={{ marginLeft: "50px", marginTop: '-22px' }}>{item.Sex == "false" ? "女" : "男"}</li></span>
                            就诊卡号： <li style={{ marginLeft: "100px", marginTop: "-20px" }}>{item.Card}</li>
                            <span style={{display:"flex",marginLeft:"200px",marginTop:"-20px"}}>
                                证件号： <li>{item.Documents}</li>

                            </span>

                        </ul>
                    })
                }
            </div>
        </div >
    )
}

export default Disease